﻿<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Menu.aspx.cs" Inherits="testing_Menu" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title> </title>
    <meta name="Keywords" content="" />
    <meta name ="description" content="" />
    <link href="default.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript">
<!--
var timeout         = 500;
var closetimer		= 0;
var ddmenuitem      = 0;

// open hidden layer
function mopen(id)
{	
	// cancel close timer
	mcancelclosetime();

	// close old layer
	if(ddmenuitem) ddmenuitem.style.visibility = 'hidden';

	// get new layer and show it
	ddmenuitem = document.getElementById(id);
	ddmenuitem.style.visibility = 'visible';

}
// close showed layer
function mclose()
{
	if(ddmenuitem) ddmenuitem.style.visibility = 'hidden';
}

// go close timer
function mclosetime()
{
	closetimer = window.setTimeout(mclose, timeout);
}

// cancel close timer
function mcancelclosetime()
{
	if(closetimer)
	{
		window.clearTimeout(closetimer);
		closetimer = null;
	}
}

// close layer when click-out
document.onclick = mclose; 
// -->
</script>
</head>

<body>
    <form id="form1" runat="server">
    <div>
         <ul id="sddm"> 
            <li> 
           <a href ="#"  onmouseover="mopen('m1')" onmouseout="mclosetime()" > 
                     <span class="menuleft">  </span>
                     <span class="menumid">   Home  </span>      
                     <span class="menuright"> </span>
           </a>
                <div id="m1" onmouseover="mcancelclosetime()" onmouseout="mclosetime()">
                <a href="#">HTML DropDown</a>
		        <a href="#">DHTML DropDown menu</a>
		        <a href="#">JavaScript DropDown</a>
		        <a href="#">DropDown Menu</a>
		        <a href="#">CSS DropDown</a>
		        <div class="btm-bg"></div>
		     </div>
		     
            </li>
            <li>
             <a href ="#" onmouseover="mopen('m2')" onmouseout="mclosetime()" > 
                     <span class="menuleft">  </span>
                     <span class="menumid"> Download </span>      
                     <span class="menuright"> </span>
                  </a>
		        <div id="m2" onmouseover="mcancelclosetime()" onmouseout="mclosetime()">
		            <a href="#">ASP Dropdown</a>
		            <a href="#">Pulldown menu</a>
		            <a href="#">AJAX dropdown</a>
		            <a href="#">DIV dropdown</a>
		        </div>
	        </li>
        </ul>
            
            
             <%-- 
                        <div style="border-top: 1px solid #cdcdcd; width:100%; "> &nbsp; </div>
                       
            <div>
            <ul  >   
               <li> 
                  <a href ="#"  onmouseover="mopen('m1')" onmouseout="mclosetime()" > 
                     <span class="menuleft">  </span>
                     <span class="menumid">   Home  </span>      
                     <span class="menuright"> </span>
                  </a>
                  
                            <div id="m1" onmouseover="mcancelclosetime()" onmouseout="mclosetime()"  >
                            <div>
                              <ul>
                                <li>
                                    <a href="#">HTML DropDown</a>
		                            <a href="#">DHTML DropDown menu</a>
		                            <a href="#">JavaScript DropDown</a>
		                            <a href="#">DropDown Menu</a>
		                            <a href="#">CSS DropDown</a>
		                        </li>
		                      </ul> 
		                     </div> 
		                    
		                    </div>
                        </li>                        
                     </ul>      
            </div>
        
        --%>
    </div>
    </form>
</body>
</html>
